<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-CN">

<head>
<base href="${blogSystem }/">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!--声明文档兼容模式，表示使用IE浏览器的最新模式-->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--设置视口的宽度(值为设备的理想宽度)，页面初始缩放值<理想宽度/可见宽度>-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<title>主页</title>

<!-- 引入Bootstrap核心样式文件 -->
<link href="css/bootstrap.css" rel="stylesheet">
<!-- 引入jQuery核心js文件 -->
<script src="js/jquery-1.11.3.min.js"></script>
<!-- 引入BootStrap核心js文件 -->
<script src="js/bootstrap.min.js"></script>

<link href="css/front/blog.css" rel="stylesheet">
</head>

<body>
	<!--头部-->
	<div class="container">
		<div class="row">
			<div class="col-lg-4 col-md-4">
				<img src="img/logo_small.gif" />
			</div>
			<div class="col-lg-4 col-md-4 red head-blog">博客</div>
			<div class="col-lg-4 col-md-4 head-right">
				<a href="${loginUrl }">${login }</a> <a href="${regUrl }">${reg }</a>
			</div>
		</div>
	</div>

	<!--导航-->
	<div class="container margin-top-10">
		<nav class="navbar navbar-inverse" style="margin:10px -15px;">
		<div class="container-fluid">
			<!-- 当浏览器变窄的时候回显示这个button按钮 -->
			<div class="navbar-header">
				<button type="button" class="navbar-toggle collapsed"
					data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
					aria-expanded="false">
					<span class="sr-only">Toggle navigation</span> <span
						class="icon-bar"></span> <span class="icon-bar"></span> <span
						class="icon-bar"></span>
				</button>
				<a class="navbar-brand active" href="front/blog">园子</a>
			</div>
			<!--收集的导航链接，和其他形式的内容，锁定-->
			<div class="collapse navbar-collapse"
				id="bs-example-navbar-collapse-1">
				<ul class="nav navbar-nav">
					<c:forEach items="${cla }" var="name">
						<li><a href="front/blog?classId=${name.getClassId() }">${name.getClassName() }</a></li>
					</c:forEach>


				</ul>
				<form class="navbar-form navbar-right" action="front/blog" method="post">
					<div class="form-group">
						<input type="text" class="form-control" placeholder="请输入关键词" name="sousuo">
					</div>
					<button type="submit" class="btn btn-default ">搜索</button>
				</form>

			</div>
			<!-- /.navbar-collapse -->
		</div>
		<!-- /.container-fluid --> </nav>
	</div>

	<!--主体部分-->
	<div class="container">
		<div class="row">
			<!--左侧-->
			<div class="col-lg-2 col-lg-2">

				<!--48小时阅读排行-->
				<div class="row notice">
					<div class="panel panel-default">
						<div class="panel-heading">
							<h3 class="panel-title">
								<a href="#">一周阅读排行</a>
							</h3>
						</div>
						<c:forEach items="${weekArt }" var="weekArticle">
							<div class="panel-body">
								<a href="front/article?articleId=${weekArticle.getArtId() }">${weekArticle.getArtTitle() }
									(${weekArticle.getArtRead() })</a>
							</div>
						</c:forEach>

					</div>
				</div>
			</div>
			<div class="col-lg-1 col-lg-1"></div>

			<!--中间-->
			<div class="col-lg-6 col-lg-6">
				<!--文章-->
				<c:forEach items="${pageBean.date }" var="article">
					<div class="row article">
						<!--文章标题-->
						<div class="row title">
							<a href="front/article?articleId=${article.getArtId() }">${article.getArtTitle() }</a>
						</div>
						<!--图片加内容-->
						<div class="row context">
							<img src="img/20161221105339.png" /> <span class="font">
								${article.getArtContext() }</span> <span>......</span>
						</div>

						<!--文章信息-->
						<div class="row infomation">
							<!--作者-->
							<a href="front/main?userId=${article.getArtUserId() }"
								class="author">${article.getName() }</a>
							<!--发布时间-->
							<span id=""> 发布于${article.getArtTime() } </span>
							<!--评论-->
							<a href="front/article?articleId=${article.getArtId() }#dingwei">评论(${article.getComNum() })</a>
							<!--阅读-->
							<a href="front/article?articleId=${article.getArtId() }">阅读(${article.getArtRead() })</a>
						</div>
					</div>
				</c:forEach>



				

			</div>

			<div class="col-lg-1 col-lg-1"></div>

			<div class="col-lg-2 col-lg-2">
				<!--公告-->
				<div class="row notice">
					<div class="panel panel-default">
						<div class="panel-heading">
							<h3 class="panel-title">公告</h3>
						</div>
						<c:forEach items="${noti }" var="notice">
							<div class="panel-body">
								<a href="#">${notice.notTitle }</a>
							</div>
						</c:forEach>
						
					</div>
				</div>


			</div>
		</div>
	</div>

	<!--底部-->
	<div class="container">
		<div class="row">
		<div class="row page">
					<nav aria-label="Page navigation">
					<ul class="pagination">
						<!-- 上一页 -->
						<!-- 判断当前页是否是第一页 -->
						<c:if test="${pageBean.currentPage==1 }">
							<li class="disabled"><a href="javascript:void(0);"
								aria-label="Previous"> <span aria-hidden="true">&laquo;</span>
							</a></li>
						</c:if>
						<c:if test="${pageBean.currentPage!=1 }">
							<li><a
								href="front/blog?currentPage=${pageBean.currentPage-1}"
								aria-label="Previous"> <span aria-hidden="true">&laquo;</span>
							</a></li>
						</c:if>
						<c:forEach begin="1" end="${pageBean.totalPage }" var="page">
							<!-- 判断当前页 -->
							<c:if test="${pageBean.currentPage==page }">
								<li class="active"><a href="javascript:void(0);">${page}</a></li>
							</c:if>
							<c:if test="${pageBean.currentPage!=page }">
								<li><a href="front/blog?currentPage=${page}">${page}</a></li>
							</c:if>

						</c:forEach>

						<!-- 判断当前页是否是最后一页 -->
						<c:if test="${pageBean.currentPage==pageBean.totalPage }">
							<li class="disabled"><a href="javascript:void(0);"
								aria-label="Next"> <span aria-hidden="true">&raquo;</span>
							</a></li>
						</c:if>
						<c:if test="${pageBean.currentPage!=pageBean.totalPage }">
							<li><a
								href="front/blog?currentPage=${pageBean.currentPage+1}"
								aria-label="Next"> <span aria-hidden="true">&raquo;</span>
							</a></li>
						</c:if>
					</ul>
					</nav>
				</div>
			<div class="col-lg-2"></div>
			<div class="col-lg-8 bottom">
				友情链接： <a href="#"><img src="img/aliyun.png" /></a> <a href="#">腾讯云</a>
				<a href="#">沪江网</a> <a href="#">站长之间</a> <a href="#">天极网</a> <a
					href="#">A5源码下载</a> <a href="#">葡萄城控件</a> <a href="#">又拍云</a> <a
					href="#">听云APP</a> <a href="#">融云IM云</a> <a href="#">图谱软件</a> <a
					href="#">百度MIP博客</a> <a href="#">环信IM</a> <a href="#">腾讯We Test</a>
				<a href="#">飞鸽传书</a> <a href="#">美团云</a> <a href="#">网易云</a> <a
					href="#">百度云</a> <a href="#">腾讯防御云</a>

			</div>
			<div class="col-lg-2"></div>
		</div>
		<div class="row about">
			<a href="#">关于博客园</a> <a href="#">联系我们</a> <span id="">
				&copy;2004-2018 </span> <a href="#">博客园</a> <span id=""> 保留所有权利 </span> <a
				href="#">沪ICP备09004260</a>
		</div>
		<div class="row safe">
			<img src="img/cnnic.png" /> <span> 沪公网安备3101152001144 </span> <img
				src="img/ghs.png" />
		</div>
	</div>
</body>

</html>